import jQuery from 'jquery'

export function getBody(vm) {
  return jQuery(vm.hasPreview ? `${!vm.development ? '.view-show .preview-body' : '.preview-body'}` : '.container-pane')
}

function pageMainOrDialogMain(dom, _height, hasComponentBox = true) {
  // console.log('高度获取 pageMainOrDialogMain ', dom, dom.parents('.dialog-main'))
  let $dialogMain = dom.parents('.dialog-main')
  if ($dialogMain.length > 0) {
    let h = $dialogMain.eq(0).find('.page-modal-body').height()

    //如果配置页面比较特殊
    // 分割面板上面有其它
    if (dom.parents('.preview-canvas').length > 0) {
      // console.log('pageMainOrDialogMain：', {
      //   dom: dom,
      //   a: dom.parents('.dialog-main').find('.page-modal-body'),
      //   h: h,
      // })
      // console.log({
      //   a: dom.parents('.preview-canvas').children('.component-box'),
      // })

      if (hasComponentBox) {
        dom
          .parents('.preview-canvas')
          .children('.component-box')
          .each(function () {
            if (!jQuery(this).hasClass('uiSplitpanes')) {
              h = h - jQuery(this).height()
              console.log('demodemo', h, jQuery(this).height())
            }
          })
      }
    }

    return h
  } else {
    //没有弹框 高度返回
    return _height
  }
}

function hasDialogContent(dom) {
  if (dom.parents('.dialog-main').length > 0) {
    return true
  } else {
    return false
  }
}

function findSplitpanesPane(vm, body) {
  let _body = body || getBody(vm)
  let _pane = _body.parents('.splitpanes__pane')
  // console.log('高度获取-2 _pane', _pane)
  let _layerPage = _pane.length > 0 ? _pane[0] : jQuery('.layer-page')[0]
  // console.log('高度获取-3 _layerPage', _layerPage)
  return _layerPage
}

//查找上面是否有上下布 局
function findPrevUiLayoutBox(dom, _height, offsetHeight = 0) {
  let _header = dom.parents('.ui-layout-box-header')
  let _content = dom.parents('.ui-layout-box-content')
  let _footer = dom.parents('.ui-layout-box-footer')
  if (_header && _header.length > 0) {
    _height = _header.eq(0).height()
  }
  if (_content && _content.length > 0) {
    _height = _content.eq(0).height()
  }
  if (_footer && _footer.length > 0) {
    _height = _footer.eq(0).height()
  }

  return _height - offsetHeight
}

function findTabs(_body, domHeight, height = 0) {
  let _el_tabs__content = []
  if (_body) {
    _el_tabs__content = _body.parents('.el-tabs__content')
  }
  return _el_tabs__content.length > 0 ? domHeight - height : domHeight
}

// function findForm(_body, domHeight, height = 0) {
//   let _content = []
//   if (_body) {
//     _content = _body.parents('.ui-form')
//   }
//   return _content.length > 0 ? domHeight - height : domHeight
// }

//表格高度获取
function uiTableHeight(vm) {
  let _height = 0
  let _body = getBody(vm)
  let _dom = _body.find(`#uiTable-body-${vm.info._id}`)
  if (vm.info.type === 'uiDynamicTable') {
    _dom = _body.find(`#uiDynamicTable-body-${vm.info._id}`)
  }
  if (vm.info.type === 'uiPrintTable') {
    _dom = _body.find(`#uiPrintTable-body-${vm.info._id}`)
  }

  let _pane = findSplitpanesPane(vm, _dom)
  let _splitpaneHeight = _pane ? _pane.clientHeight - 14 : 0 //- (vm.hasPreview ? 30 : 10)

  let _layoutBoxHeight = findPrevUiLayoutBox(_dom, _splitpaneHeight, 0) //偏移高度

  if (_layoutBoxHeight > _splitpaneHeight) {
    _height = _splitpaneHeight
  } else {
    _height = _layoutBoxHeight
  }
  // console.log('uiTableHeight-22', _height)
  // if (hasDialogContent(_dom)) {
  //   _height = pageMainOrDialogMain(_dom, _height)
  //   console.log('高度获取-11 ', _dom, _height)
  //   let _content = _dom.parents('.splitpanes__pane')
  //   if (_content.length > 0) {
  //     _height = _content[0].clientHeight
  //     console.log('表格高度0 _height 1', _content[0].clientHeight)
  //   }
  // }

  let _uiSplitpanes = _dom.parents('.uiSplitpanes')
  //如果在分割面板第三层可以不要高度
  if (_uiSplitpanes.length < 3) {
    //如果表格在tabs里
    _height = findTabs(_dom, _height, 30)
  } else {
    // _height = _height - 160
    let _tabs = _dom.parents('.el-tabs__content')
    if (_tabs.length > 0) {
      // 判断当前的表格组件是否在分割面板里面，并且该分割面板在tab页下面
      const parentTab = _dom.parents('.el-tab-pane')[0]
      const childPane = parentTab ? jQuery(parentTab).find('.uiSplitpanes') : []
      // if (vm.info._id === 'uiTable_aees6l') {
      //   console.log('子分割面板', childPane, parentTab)
      // }
      // 如果有分割面板的话 则代表此时表格高度不用重新赋值
      if (!childPane.length) {
        let _pane = jQuery(_tabs[0]).parents('.splitpanes__pane')
        if (_pane.length > 0) {
          _height = _pane ? _pane[0].clientHeight - 24 - 15 : 0
        }
      }
    }
  }
  // console.log('uiTableHeight-33', vm.info._id, _pane, _height)
  // 判断表格组件是否有同级的其他组件 如果有的话需要减掉同级其他组件的高度
  // console.log('表格组件实例 ====================== ', _dom, _dom.parent(), _dom.parent().siblings())
  const siblings = _dom.parent().siblings()
  for (let ei = 0; ei < siblings.length; ei++) {
    console.log(siblings[ei])
    if (siblings[ei] !== _dom.parent()) {
      _height -= siblings[ei].clientHeight + 8
    }
  }

  return _height
}

//表单高度获取
function uiFormHeight(vm) {
  let _body = getBody(vm).find(`#uiform_${vm.info._id}`)
  let _pane = findSplitpanesPane(vm, _body)
  //_pane.clientHeight
  let _height = _pane ? jQuery(_pane).height() - 40 : 0
  let _uiSplitpanes = _body.parents('.uiSplitpanes')
  //如果在分割面板第三层可以不要高度
  // console.log('_uiSplitpanes', _uiSplitpanes, _body, _height, _pane)
  if (_uiSplitpanes.length < 3) {
    //如果表单在tabs里
    _height = findTabs(_body, _height, 25)
  }
  // 如果表单所在的分割面板组件在tab组件内部 则需要重新计算
  const paneTabParents = jQuery(_pane).parents('.uiTabs')
  if (paneTabParents.length) {
    // 分割面板在tab组件下面的话则表单组件的高度就是分割高度
  }
  _height = findPrevUiLayoutBox(_body, _height)
  // 判断表单组件有没有兄弟组件 需要减去兄弟组件的高度
  const parentNode = _body.parents('.uiForm')[0]
  const siblings = jQuery(parentNode).siblings()
  // if (siblings.length === 1) {
  //   _height = jQuery(_pane).height() - 20
  // }
  if (siblings.length) {
    // for (let i = 0; i < siblings.length; i++) {
    //   // 如果兄弟组件为动态计算高度的组件则不减去兄弟组件的高度
    //   let flag = true
    //   const ignoreModules = [
    //     'uiLayoutBox',
    //     'uiTable',
    //     'uiPrintTable',
    //     'uiFullcalendar',
    //     'uiFlowChart',
    //     'uiDynamicTable',
    //     'uiPdaForm',
    //     'uiCirculationForm',
    //     'uiSplitpanes',
    //     'uiImage',
    //     'uiPrintLog',
    //   ]
    //   ignoreModules.forEach((i) => {
    //     if (siblings[i].className.indexOf(i) > -1) flag = false
    //   })
    //   flag && (_height -= siblings[i].clientHeight)
    // }
  }
  // console.log('Nico1', vm.info._id, _pane, jQuery(_pane).height(), _height, findPrevUiLayoutBox(_body, _height))
  return _height > 0 ? _height : 10
}
//表单高度获取
function uiCirculationFormHeight(vm) {
  let _body = getBody(vm).find(`#uiCirculationForm_${vm.info._id}`)
  let _pane = findSplitpanesPane(vm, _body)
  let _height = _pane ? _pane.clientHeight - 30 : 0

  //如果表单在tabs里
  _height = findTabs(_body, _height, 50)

  return _height
}

function uiSplitpanesHeight(vm) {
  let _body = getBody(vm)
  let _height = 0
  if (_body.length > 0) {
    _height = _body[0].clientHeight - (vm.hasPreview ? 5 : 80)

    let _dom = _body.find(`#uiSplitpanes_${vm.info._id}`)

    // console.log('高度获取-4-1 uiSplitpanesHeight', _height, hasDialogContent(_dom), _dom)
    if (hasDialogContent(_dom)) {
      _height = pageMainOrDialogMain(_dom, _height)

      let _content = _dom.parents('.page-modal-body .splitpanes__pane')
      // console.log('高度获取-4-2 ', _dom, _height, _content, _content.length)
      if (_content.length > 1) {
        _height = _content[0].clientHeight
        // console.log('高度获取-4-3 _height 1', _content[0].clientHeight)
      }
    } else {
      let _content = _dom.parents('.splitpanes__pane')
      // console.log('高度获取-4-2 ', _dom, _height, _content, _content.length)
      if (_content.length > 1) {
        _height = _content[0].clientHeight
        // console.log('高度获取-4-3 _height 1', _content[0].clientHeight)
      }
    }
    _height = findPrevUiLayoutBox(_dom, _height, 4)
    // console.log('高度获取-4-4 findPrevUiLayoutBox', _dom, _height)
    //如果分割面板在form里
    // _height = findForm(_dom, _height, 0)
    // console.log('bbfpl123123123', _height, _dom)
    //如果分割面板在tabs里
    // _height = findTabs(_dom, _height, 24)
    let _tabs = _dom.parents('.el-tabs__content')
    if (_tabs.length > 0) {
      let _pane = jQuery(_tabs[0]).parents('.splitpanes__pane')
      // if (vm.info._id === 'uiSplitpanes_c4coeq') {
      //   console.log('父分割面板--', _pane)
      // }
      if (_pane.length > 0) {
        // 当前元素的所在tab组件的兄弟元素
        const currentTab = _dom.parents('.uiTabs.component-box')[0]
        const siblings = jQuery(currentTab).siblings()
        // if (vm.info._id === 'uiSplitpanes_c4coeq') {
        //   console.log('父分割面板', currentTab, siblings)
        // }
        _height = _pane ? _pane[0].clientHeight - 40 : 0
        // 减去tab组件的兄弟元素的高度
        if (siblings.length) {
          _height -= 20
          for (let i = 0; i < siblings.length; i++) {
            _height -= siblings[i].clientHeight
          }
        }
      } else {
        _height = findTabs(_dom, _height, 24)
      }
    }
  }
  return _height
}

//上下布局高度计算
function uiLayoutBoxHeight(vm) {
  let _body = getBody(vm)
  let _height = 0
  // console.log('高度获取 uiLayoutBox _body', _body)
  if (_body.length > 0) {
    _height = _body[0].clientHeight - (vm.hasPreview ? 10 : 80)

    let _dom = _body.find(`#${vm.info._id}`)
    //如果在splitpanes__pane里面
    let _splitpanes__pane = _dom.parents('.splitpanes__pane')
    if (_splitpanes__pane.length > 0) {
      _height = _splitpanes__pane[0].clientHeight
      // console.log('高度获取 uiLayoutBox _height_height', _height, _splitpanes__pane, _splitpanes__pane[0].clientHeight)
    }
    //普通图层里获取高度
    // console.log('高度获取 uiLayoutBox _dom', _dom, `#${vm.info._id}`)
    let _tabs = _dom.parents('.el-tabs__content')
    if (_tabs.length > 0) {
      _height = _height - 24
    }
    // console.log('高度获取 uiLayoutBox  111', _height)
    //弹框图层里获取高度
    if (hasDialogContent(_dom)) {
      _height = pageMainOrDialogMain(_dom, _height, false)

      // console.log('高度获取 uiLayoutBox  222', _height)
    }
  }

  return _height
}

//图片高度计算
function uiImageHeight(vm) {
  let _body = getBody(vm).find(`#uiImage_${vm.info._id}`)
  let _pane = findSplitpanesPane(vm, _body)
  //_pane.clientHeight
  let _height = _pane ? jQuery(_pane).height() - 40 : 0
  let _uiSplitpanesPane = _body.parents('.splitpanes__pane')
  if (_pane.length > 0) {
    _height = _uiSplitpanesPane ? _uiSplitpanesPane[0].clientHeight : 0
  }
  return _height
}
function uiPrintLogHeight(vm) {
  let _body = getBody(vm).find(`#uiPrintLog_${vm.info._id}`)
  let _pane = findSplitpanesPane(vm, _body)
  //_pane.clientHeight
  let _height = _pane ? jQuery(_pane).height() : 0
  let _uiSplitpanesPane = _body.parents('.splitpanes__pane')
  if (_pane.length > 0) {
    _height = _uiSplitpanesPane ? _uiSplitpanesPane[0].clientHeight : 0
  }
  return _height
}
export function domHeight(vm) {
  let _height = 0

  if (vm.info.type === 'uiLayoutBox') {
    _height = uiLayoutBoxHeight(vm)
  }

  // 预约看板与流程图的高度暂时使用表格高度计算方式
  if (
    vm.info.type === 'uiTable' ||
    vm.info.type === 'uiPrintTable' ||
    vm.info.type === 'uiFullcalendar' ||
    vm.info.type === 'uiFlowChart' ||
    vm.info.type === 'uiDynamicTable'
  ) {
    _height = uiTableHeight(vm)
  }
  if (vm.info.type === 'uiForm' || vm.info.type === 'uiPdaForm') {
    _height = uiFormHeight(vm)
  }
  if (vm.info.type === 'uiCirculationForm') {
    _height = uiCirculationFormHeight(vm)
  }
  if (vm.info.type === 'uiSplitpanes') {
    _height = uiSplitpanesHeight(vm)
  }

  if (vm.info.type === 'uiImage') {
    _height = uiImageHeight(vm)
  }
  if (vm.info.type === 'uiPrintLog') {
    _height = uiPrintLogHeight(vm)
  }

  return _height
}
